<template lang="pug">
.app
  div(ref="lineBar" style="width:800px;height:400px")
</template>
<script>
export default {
  mounted() {
    this.drawChart();
  },
  methods: {
    drawChart() {
      let homeBar = this.$refs.lineBar;
      let option = {
        color: ["#3398DB"],
        tooltip: {
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow" // 默认为直线，可选为：'line' | 'shadow'
          }
        },
        grid: {
          left: "3%",
          right: "4%",
          bottom: "3%",
          containLabel: true
        },
        xAxis: [
          {
            type: "category",
            data: ["周一", "Tue", "dd", "Thu", "Fri", "Sat", "Sun"],
            axisTick: {
              alignWithLabel: true
            }
          }
        ],
        yAxis: [
          {
            type: "value"
          }
        ],
        series: [
          {
            name: "直接访问",
            type: "bar",
            barWidth: "60%",
            data: [10, 52, 200, 50, 390, 330, 220]
          }
        ]
      };
      this.$initCharts(homeBar, option);
    }
  }
};
</script>

